<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>内容编辑</title>
    <script src="/static/layui/layui.js"></script>
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
</fieldset>
<form class="layui-form" action="">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-inline" style="width: 600px">
                <input type="hidden" name="contentForm[id]" value="{$content.id}">
                <input type="text" name="contentForm[title]" lay-verify="required" lay-reqtext="标题是必填项，岂能为空？"
                       placeholder="请输入标题" autocomplete="off" class="layui-input"
                       value="{$content.title}">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">类型</label>
            <div class="layui-input-inline" style="width: 600px">
                <input type="text" name="contentForm[type]" lay-verify="required" autocomplete="off" class="layui-input"
                       value="{$content.type}">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">来源</label>
            <div class="layui-input-inline" style="width: 600px">
                <textarea name="contentForm[source]" required lay-verify="required" placeholder="请输入来源"
                          class="layui-textarea">{$content.source}</textarea>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">文章状态</label>
            <div class="layui-input-inline" style="width: 600px">
                <select name="contentForm[status]" lay-search="true">
                    <option value="" selected>请选择</option>
                    <option value="0" {$content.status==0?"selected":""}>未发布</option>
                    <option value="1" {$content.status==1?"selected":""}>审核中</option>
                    <option value="2" {$content.status==2?"selected":""}>已发布</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">内容(支持图文)</label>
            <div class="layui-input-block" style="width: 130%">
                <textarea name="contentForm[content]" id="areaDemo"
                          style="display: none;">{$content.content}</textarea>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="login">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<script>
    var $, layer, form, layedit, layedit_data;
    layui.use(['form', 'layer', 'layedit'], function () {
        layedit = layui.layedit;
        $ = layui.jquery;
        form = layui.form;
        layer = layui.layer;
        layedit_data = layedit.build('areaDemo', {
                uploadImage: {
                    url: '/admin/content/upload',
                    type: 'post',
                }
            }
        ); //建立编辑器

        //监听提交
        form.on('submit(login)', function (data) {
            fromData = data.field;
            fromData["contentForm[content]"] = layedit.getContent(layedit_data);
            layer.load(0, {shade: false}); //0代表加载的风格，支持0-2{time: 10*1000}
            $.ajax({ //异步请求返回给后台
                url: "{:url('/admin/content/save')}",
                type: 'POST',
                data: fromData,
                dataType: 'json',
                success: function (res) {
                    console.log(res);
                    layer.closeAll();
                    layer.alert(res.msg,{yes:function () {
                            parent.layer.closeAll();
                        }})
                },
                error: function (e) {
                    layer.closeAll();
                    layer.msg("失败");
                }
            });
            return false;
        });
    });
</script>
</body>
</html>